// 基本信息
import { addDict, modDict } from "@/api/modules/system/dict";
import DialogBox from "@/components/DialogBox";
import { showTips } from "@/utils/util";
import { ElForm } from "element-plus";
import { defineComponent, PropType } from "vue";
interface DeviceForm {
	[key: string]: any;
}
export default defineComponent({
	props: {
		detail: {
			type: Object as PropType<DeviceForm>,
			default() {
				return {};
			}
		}
	},
	emits: ["submit"],
	setup(props, { attrs, emit }) {
		type FormInstance = InstanceType<typeof ElForm>;
		const formRef = ref<FormInstance>();
		const formRule = reactive({
			dictType: [{ required: true, message: "请输入字典标识", trigger: "change" }],
			dictLabel: [{ required: true, message: "请输入字典名称", trigger: "change" }],
			dictValue: [{ required: true, message: "请添加数据值", trigger: "change" }]
		});
		const validData = () => {
			formRef.value?.validate(async valid => {
				if (valid) {
					props.detail.dictSort = parseInt(props.detail.dictSort);
					let api = props.detail.dictCode ? modDict : addDict;
					let { code } = await api({ ...props.detail });
					let ok = showTips(code, "字典配置");
					if (ok) {
						emit("submit");
					}
				}
			});
		};
		onMounted(() => {
			//默认为软产品
		});
		return () => {
			return (
				<DialogBox
					{...attrs}
					onConfirm={() => {
						validData();
					}}
				>
					<el-form model={props.detail} ref={formRef} rules={formRule} label-width="100px">
						<el-form-item label="字典类型" prop="dictType">
							<el-input v-model={props.detail.dictTypeName} disabled />
						</el-form-item>
						<el-form-item label="字典名称" prop="dictLabel">
							<el-input v-model={props.detail.dictLabel} />
						</el-form-item>
						<el-form-item label="数据值" prop="dictValue">
							<el-input v-model={props.detail.dictValue} />
						</el-form-item>
						<el-form-item label="排序" prop="dictSort">
							<el-input v-model={props.detail.dictSort} />
						</el-form-item>
						<el-form-item label="状态" prop="status">
							<el-radio-group v-model={props.detail.status}>
								<el-radio-button label={1}>正常</el-radio-button>
								<el-radio-button label={0}>停用</el-radio-button>
							</el-radio-group>
						</el-form-item>
						<el-form-item label="备注" prop="remark">
							<el-input v-model={props.detail.remark} type="textarea" />
						</el-form-item>
					</el-form>
				</DialogBox>
			);
		};
	}
});
